
let liList = $('.center-main .weather .wlist >ul li')
function GetDateStr(AddDayCount) {
    var dd = new Date();
    dd.setDate(dd.getDate() + AddDayCount); //获取AddDayCount天后的日期
    var y = dd.getFullYear();
    var m = dd.getMonth() + 1; //获取当前月份的日期
    var d = dd.getDate();
    return m + '月' + d + "日";
}

function GetWeeksStr(AddDayCount) {
    var dd = new Date();
    dd.setDate(dd.getDate() + AddDayCount); //获取AddDayCount天后的日期
    var dayCycle = dd.getDay();
    var dayCycleArray = ["周日", "周一", "周二", "周三", "周四", "周五", "周六",];
    for (var i = 0; i < 7; i++) {
        if (dayCycle == i) {
            //将dayCycleArray的数赋值到系统周几里面中去;
            dayCycle = dayCycleArray[i];
        }
    }
    return dayCycle
}

$(".weather .con .t1 .week-span").text(GetWeeksStr(0))
$(".weather .con .t1 .date-span").text(GetDateStr(0))
for (let i = 0; i < liList.length; i++) {
    liList.eq(i).children('.name').children('span').text(GetWeeksStr(i + 1))
}



// 天气分析
var weatherTpl = $("#weatherTpl").html();
// 获取本地json数据
function setWeather(data) {
    var value = soda(weatherTpl, data);
    $(".page1 .weather").html(value)
    // value = null;
}
var week = ["星期一", "星期二", "星期三", "星期四", "星期五", "星期六", "星期日"]
// 近7天客流量
var option_pass = {
    backgroundColor: '',
    title: {
        text: '',
        textStyle: {
            fontWeight: 'normal',
            fontSize: 16,
            color: '#F1F1F3'
        },
        left: '6%'
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            lineStyle: {
                color: '#fff'
            }
        },
        formatter: function (params) {// 简写： formatter: "{a} <br/> {b} : {d}%"
            var obj = JSON.parse(JSON.stringify(params));
            var windex = option_pass.xAxis[0].data.indexOf(obj[0].axisValue)
            var str = obj[0].axisValue + '  ' + week[windex] + '<br/>'+ '客流  ' + obj[0].value
            return str
        }
    },
    grid: {
        left: '2%',
        right: '6%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: [{
        type: 'category',
        boundaryGap: false,
        splitLine: {
            show: true,
            lineStyle: {
                width: 1,
                color: '#57617B'
            }
        },
        axisLabel: {
            margin: 10,
            textStyle: {
                color: "#ffffff",
                fontSize: 12
            }
        },
        axisLine: {
            lineStyle: {
                color: '#57617B'
            }
        },
        data: []
    }],
    yAxis: [{
        type: 'value',
        axisTick: {
            show: false
        },
        axisLine: {
            lineStyle: {
                color: '#57617B' // 设置坐标轴颜色
            }
        },
        axisLabel: {
            margin: 10,
            textStyle: {
                color: "#ffffff",
                fontSize: 12
            }
        },
        splitLine: {
            lineStyle: {
                color: '#57617B'
            }
        }
    }],
    series: [{
        name: '客流量',
        type: 'line',
        smooth: false,
        symbol: 'circle',
        symbolSize: 5,
        showSymbol: true,
        lineStyle: {
            normal: {
                width: 3
            }
        },
        areaStyle: {
            normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                    offset: 0,
                    color: "#357a71"
                }, {
                    offset: 1,
                    color: "#00081f"
                }], false),
                shadowColor: 'rgba(0, 0, 0, 0.1)',
                shadowBlur: 10
            }
        },
        itemStyle: {
            normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                    { //填充的颜色。
                        offset: 0, // 0% 处的颜色
                        color: "#357a71"
                    }, {
                        offset: 1, // 80% 处的颜色
                        color: "#00081f"
                    }], false),
                borderColor: 'rgba(39,100,105, 0.99)', //图形的描边颜色。支持的格式同 color
                borderWidth: 3 //描边线宽。为 0 时无描边。[ default: 0 ]
            }
        },
        data: []
    },]
};
// 近七天客流量
function passengerFlow(data) {
    option_pass.xAxis[0].data = data.xAxis
    option_pass.series[0].data = data.data
    week = data.week
    $("#sevenTotal").text(data.total_num);
    var passDiv = echarts.init(document.getElementById('passDiv'));
    passDiv.setOption(option_pass, false);
}

// 语音画册
function setVoice(data) {
    // $("#vTotal").text(data.total_num)
    var peopleMonths = data.total_num.split('');
    if (peopleMonths.length <= 0) {
        $(".voice .ci").append(`<div class="num" id="vTotal">0</div>`);
    } else {
        for (let i = 0; i < peopleMonths.length; i++) {
            $(".voice .ci").append(`<div class="num" id="vTotal">` + peopleMonths[i] + `</div>`);
        }
    }

    $("#vo1").text(data.total_time.hours)
    $("#vo2").text(data.total_time.minutes)
    $("#vo3").text(data.total_time.seconds)
    var tpl = $("#vTop").html() + '';
    var data1 = {};
    data1.list = data.top10.slice(0, 5)
    var vb1 = soda(tpl, data1);
    tpl = null;
    $("#vBox1").html(vb1)
    var data2 = {};
    data2.list = data.top10.slice(5, 10)
    var tpl2 = $("#vTop2").html() + '';
    var vb2 = soda(tpl2, data2);
    tpl2 = null;
    $("#vBox2").html(vb2);
}
// setVoice()
// 今日统计
function todayStatistics(data) {
    $(".xiaoNum").text(data.today_sale);
    $(".peopleNum").text(data.today_check);
}
// todayStatistics();

// 客流饱和度
option_pass_per = {
    title: {
        text: '50%',
        x: 'center',
        y: 'center',
        textStyle: {
            fontWeight: 'normal',
            color: '#4a87ca',
            fontSize: '26'
        }
    },
    color: ['rgba(176, 212, 251, 1)'],
    series: [{
        name: '客流饱和度',
        type: 'pie',
        clockWise: true,
        radius: ['65%', '75%'],
        itemStyle: {
            normal: {
                label: {
                    show: false
                },
                labelLine: {
                    show: false
                }
            }
        },
        hoverAnimation: false,
        color: [{
            type: 'linear',
            x2: 0.4,
            y2: 1,
            colorStops: [{
                offset: 0,
                color: "#4b85dd" // 0% 处的颜色
            }, {
                offset: 1,
                color: "#499464" // 100% 处的颜色
            }],
            globalCoord: false // 缺省为 false
        }, 'none'],
        data: [{
            value: 0,
            name: '客流饱和度',
            itemStyle: {
                normal: {
                    color: '#999',
                    label: {
                        show: false
                    },
                    labelLine: {
                        show: false
                    }
                },

            }
        }, {
            value: 500,
            name: 'invisible'
        }]
    }
    ]
}
var passPerDiv = echarts.init(document.getElementById('passPerDiv'));
option_pass_per.series[0].data[0].itemStyle.normal.color = '#1b2954'
// passPerDiv.setOption(option_pass_per);
function setPass(data) {
    console.log(data)
    option_pass_per.title.text = data.value + '%'
    option_pass_per.series[0].data[1].value = data.value
    option_pass_per.series[0].data[0].value = (100 - Number(data.value))

    passPerDiv.setOption(option_pass_per);
}



// 停车场使用率
option_park_per = {
    title: {
        text: '80%',
        x: 'center',
        y: 'center',
        textStyle: {
            fontWeight: 'normal',
            color: '#f9a555',
            fontSize: '26'
        }
    },

    series: [{
        name: 'Line 1',
        type: 'pie',
        clockWise: true,
        radius: ['65%', '75%'],
        itemStyle: {
            normal: {
                label: {
                    show: false
                },
                labelLine: {
                    show: false
                }
            }
        },
        hoverAnimation: false,
        color: [{
            type: 'linear',
            x2: 0.4,
            y2: 1,
            colorStops: [{
                offset: 0,
                color: "#eecfb4" // 0% 处的颜色
            }, {
                offset: 1,
                color: "#f57406" // 100% 处的颜色
            }],
            globalCoord: false // 缺省为 false
        }, 'none'],
        data: [{
            value: 20,
            name: '01',
            itemStyle: {
                normal: {
                    color: {
                    }
                },

            }
        }, {
            value: 80,
            name: '02'
        }]
    }
    ]
}
var parkDiv = echarts.init(document.getElementById('parkDiv'));
option_park_per.series[0].data[0].itemStyle.normal.color = '#1b2954'
// 先实现静态效果
// parkDiv.setOption(option_park_per);
function stopCar(data) {
    console.log(data)
    option_park_per.title.text = data.value + '%'
    option_park_per.series[0].data[1].value = data.value
    option_park_per.series[0].data[0].value = (100 - Number(data.value))

    parkDiv.setOption(option_park_per);
}
//  TOP10客源地统计，线性渐变
function setCustom(data) {
    var cnum = [];
    data.forEach(function (val, index) {
        var obj = {};
        obj.name = val.name;
        obj.value = val.value;
        cnum.push(obj)
    })
    var cArr = utils.linerScale(cnum, 'value')
    cArr.slice(0, 5).forEach(function (item, key) {
        var $dom = $(".consumer .box1 li").eq(key);
        $dom.find(".name span").text(item.name);
        $dom.find(".name strong").text(item.value);
        $dom.find(".vol span").width(item.per + '%')
    })
    cArr.slice(5, 10).forEach(function (item, key) {
        var $dom = $(".consumer .box2 li").eq(key);
        $dom.find(".name span").text(item.name);
        $dom.find(".name strong").text(item.value);
        $dom.find(".vol span").width(item.per + '%')
    })
}

//景区驻留时长
option_resident = {
    textStyle: {
        color: '#fbed47'
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'shadow'
        }
    },

    xAxis: [
        {
            type: 'category',
            //设置字体倾斜
            axisLabel: {
                textStyle: {
                    color: "#ffffff",
                },
                interval: 0,//倾斜度 -90 至 90 默认为0
            },
            // axisLabel: {
            //     color: "#ffffff",
            //     interval: 0,
            // },
            data: []
        }
    ],
    yAxis: [
        {
            splitLine: {
                show: true,
                lineStyle: {
                    // 使用深浅的间隔色
                    color: ['#2f2f2f']
                }
            },
            axisLabel: {
                textStyle: {
                    color: "#ffffff",
                },
                interval: 0,//倾斜度 -90 至 90 默认为0
            },
            type: 'value'
        }
    ],
    series: [
        {
            name: '人数',
            type: 'bar',
            barWidth: '40%',
            data: [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6],
            itemStyle: {
                normal: {
                    color: function (params) {
                        // build a color map as your need.
                        var colorList = [
                            '#099fac', '#385da7', '#099fac', '#385da7',
                            '#099fac', '#385da7', '#099fac', '#385da7',
                        ];
                        return colorList[params.dataIndex]
                    }, label: {
                        show: true,
                        color: "#385da7",
                        position: 'top',
                        formatter: '{c}'
                    }
                }
            }
        }
    ]
};
var residentDiv = echarts.init(document.getElementById('residentDiv'));
// residentDiv.setOption(option_resident);
function setResidenet(data) {
    option_resident.xAxis[0].data = data.xAxis;
    option_resident.series[0].data = data.data;

    residentDiv.setOption(option_resident);
}

// 实时在园人数
loadData({
    type: 'get',
    url: '/bigdata/manage/index/get-today-number',
    data: {},
    interval: 3000,
    callback: function (res) {
        var num = +res.result.number;
        if (typeof num == 'number' && num >= 0) {
            show_num1(num);
        } else {
            console.error('后端在园人数接口返回数据出错，非数值类型')
        }

    }
});
// 首页聚合接口
// loadData({
//     type: 'get',
//     url: '/bigdata/manage/summary/index',
//     data: {},
//     interval: 0,
//     callback: function (res) {
//         console.log(res);
//         setWeather(res.result.weather);
//         passengerFlow(res.result.seven_day_trend);
//         // 语音画册
//         setVoice(res.result.yuyin);
//         // 今日统计
//         todayStatistics(res.result.ticket)
//         // tourist_top(res.result.tourist_top10);
//         // 客流饱和度
//         setPass(res.result.people_rate);
//         // 停车场使用率
//         stopCar(res.result.parking_rate);
//         // top10客源地游客统计
//         setCustom(res.result.tourist_top10);
//         // 景区驻留时长
//         setResidenet(res.result.stay_time)
//     }
// });

let myDAta =  {
    "code": 0,
    "msg": "",
    "result": {
        "weather": {
            "today": {
                "week": "周一",
                "date": "11月11日",
                "wind": "西南风 1-2级",
                "text": "多云",
                "high_temp": "19",
                "low_temp": "8",
                "icon": "http://qingyuan-1251225286.file.myqcloud.com/static/colours/w03.png",
                "temp": "16"
            },
            "week": [
                {
                    "week": "周二",
                    "date": "11月12日",
                    "content": "小雨",
                    "high_temp": "21",
                    "icon": "http://qingyuan-1251225286.file.myqcloud.com/static/nocolor/w06.png"
                },
                {
                    "week": "周三",
                    "date": "11月13日",
                    "content": "晴",
                    "high_temp": "15",
                    "icon": "http://qingyuan-1251225286.file.myqcloud.com/static/nocolor/w01.png"
                },
                {
                    "week": "周四",
                    "date": "11月14日",
                    "content": "晴",
                    "high_temp": "17",
                    "icon": "http://qingyuan-1251225286.file.myqcloud.com/static/nocolor/w01.png"
                },
                {
                    "week": "周五",
                    "date": "11月15日",
                    "content": "晴",
                    "high_temp": "17",
                    "icon": "http://qingyuan-1251225286.file.myqcloud.com/static/nocolor/w01.png"
                },
                {
                    "week": "周六",
                    "date": "11月16日",
                    "content": "小雨",
                    "high_temp": "17",
                    "icon": "http://qingyuan-1251225286.file.myqcloud.com/static/nocolor/w06.png"
                }
            ]
        },
        "seven_day_trend": {
            "xAxis": [
                "11.04",
                "11.05",
                "11.06",
                "11.07",
                "11.08",
                "11.09",
                "11.10"
            ],
            "data": [
                "571",
                "843",
                "383",
                "392",
                "1019",
                "2084",
                "1390"
            ],
            "week": [
                "星期一",
                "星期二",
                "星期三",
                "星期四",
                "星期五",
                "星期六",
                "星期日"
            ],
            "total_num": "6682"
        },
        "yuyin": {
            "total_time": {
                "hours": "0",
                "minutes": "17",
                "seconds": "15"
            },
            "total_num": "11",
            "top10": [
                {
                    "name": "一线天",
                    "value": "3"
                },
                {
                    "name": "玉皇宫",
                    "value": "2"
                },
                {
                    "name": "新乡八里沟",
                    "value": "1"
                },
                {
                    "name": "抱犊桥将军潭",
                    "value": "1"
                },
                {
                    "name": "红石河",
                    "value": "1"
                },
                {
                    "name": "桃花湾",
                    "value": "1"
                },
                {
                    "name": "老子布道",
                    "value": "1"
                },
                {
                    "name": "老爷顶",
                    "value": "1"
                }
            ]
        },
        "ticket": {
            "today_sale": "158",
            "today_check": "134"
        },
        "people_rate": {
            "name": "客流饱和度",
            "value": "0.08"
        },
        "parking_rate": {
            "name": "停车场使用率",
            "value": "3.87"
        },
        "stay_time": {
            "xAxis": [
                "0-10分钟",
                "10-30分钟",
                "30-120分钟",
                "2-4小时",
                "4-8小时",
                ">8小时"
            ],
            "data": [
                "126",
                "243",
                "315",
                "182",
                "120",
                "12"
            ]
        },
        "tourist_top10": [
            {
                "name": "河南",
                "value": "19"
            },
            {
                "name": "河北",
                "value": "1"
            },
            {
                "name": "湖南",
                "value": "0"
            },
            {
                "name": "宁夏",
                "value": "0"
            },
            {
                "name": "青海",
                "value": "0"
            },
            {
                "name": "甘肃",
                "value": "0"
            },
            {
                "name": "陕西",
                "value": "0"
            },
            {
                "name": "西藏",
                "value": "0"
            },
            {
                "name": "云南",
                "value": "0"
            },
            {
                "name": "贵州",
                "value": "0"
            }
        ]
    }
}
function all(res) {
    console.log(res);
    // setWeather(res.result.weather);
    passengerFlow(res.result.seven_day_trend);
    // 语音画册
    setVoice(res.result.yuyin);
    // 今日统计
    todayStatistics(res.result.ticket)
    // tourist_top(res.result.tourist_top10);
    // 客流饱和度
    setPass(res.result.people_rate);
    // 停车场使用率
    stopCar(res.result.parking_rate);
    // top10客源地游客统计
    setCustom(res.result.tourist_top10);
    // 景区驻留时长
    setResidenet(res.result.stay_time)
}
all(myDAta)
